<script setup lang="ts">
defineProps({
    value: {
        type: Number,
        required: true,
    },
    showZero: {
        type: Boolean,
        default: false,
    },
})
</script>
<template>
    <span v-if="value > 0" class="up">+{{ value }}</span>
    <span v-else-if="value < 0" class="down">{{ value }}</span>
    <span v-else-if="showZero">0</span>
</template>
<style lang="scss" scoped>
.up {
    color: var(--van-red);
}

.down {
    color: var(--van-green);
}
</style>
